<!-- 采购名称控件 -->
<template>
  <a-space direction="vertical" style="width: 100%">
    <a-input
      :class="props.oneValue ? 'colors' : ''"
      v-model="BuyName"
      :placeholder="props.props.placeholder"
      :disabled="props.disabled"
    />
  </a-space>
</template>

<script lang="ts" setup>
  import { ref, computed, watch, onMounted } from 'vue';

  const props = withDefaults(
    defineProps<{
      props: { [propName: string]: any };
      name?: string;
      required?: boolean;
      oneValue: any;
      disabled: boolean;
      regex?: {
        [name: string]: {
          role: any;
          name: any;
        };
      };
    }>(),
    {}
  );

  const emit = defineEmits(['update:oneValue']);
  const BuyName = computed({
    get: () => {
      return props.oneValue;
    },
    set: (val) => {
      emit('update:oneValue', val);
    },
  });

  const isDisabled = ref(false);

  onMounted(() => {
    if (props.oneValue !== '') isDisabled.value = true;
  });
</script>

<style scoped lang="less">
  // :deep(.arco-input-wrapper),
  :deep(.arco-input[disabled]) {
    -webkit-text-fill-color: rgb(0, 0, 0);
  }
</style>
